/*TagBar by XiLaiTL|MIT License|English-Chinese*/
/*You can copy the code below and paste it in the top of theme css file which you want*/

/*
当点击显示侧边栏时，类.pin-outline被激活（添加到body），类.open（添加到sidebar）
当点击文件时，类.active-tab-files被激活（添加到sidebar）
当点击大纲时，类.active-tab-outline被激活（添加到sidebar）
当点击树状图时，类.use-file-tree-style被激活（添加到sidebar）
*//*When you toggle sidebar, the class named ".pin-outline" is adding in the <body> and the class named ".open" is adding in the <div>#typora-sidebar. As clicking "Files", the class named ".active-tab-files" is adding in the <div>#typora-sidebar while clicking "Outline" the  the class named ".active-tab-outline" is adding in it, and clicking "Switch to tree view" the  the class named ".use-file-tree-style" is adding in it.
*/

/*=======================================================================*/
/*初始设置，让sidebar占满整个屏幕并让content显示在上方，调节其他部分依旧在左侧*//*Firstly setting for making sidebar cover the whole view and let content show above the header, and remaining other part at right area*/

/*更新层叠顺序，让content显示在header上方，并且依然保留上方调节sidebar大小的能力*//*Renew the z-index and width*/
header{ z-index: -1; }

/*设置【侧边栏】满宽度 *//*Set sidebar's width*/
.typora-node.pin-outline:not(.megamenu-opened):not(.typora-sourceview-on) #typora-sidebar{ width: 100% }

/*设置【信息侧边栏】宽度 *//*Set other parts' width*/
.info-panel-tab-wrapper{ width: var(--sidebar-width); }
.sidebar-footer{ width: var(--sidebar-width); }
#file-library-search{ width: var(--sidebar-width); }
#file-library-tree{ width: var(--sidebar-width); }
#outline-content { width: var(--sidebar-width); min-width: 0%; }

/*=======================================================================*/
/*设置TagBar的样式*//*Set the view of tag bar*/

/*【文件侧边栏-文件列表】*//*Files bar's files list*/
.pin-outline #file-library-list{
    left: var(--sidebar-width);
    position: fixed;
    top: 0;
    height:8.5%;
    min-height: 0%;
    width: 100%;
    min-width: 0%;
    overflow-x: hidden;
    overflow-y: visible;
    background-color: var(--bg-color);
    /*transform: scaleY(-1);让scroll显示在上面*//*Upside down the scroll to show on the up part*/
}
.pin-outline #file-library-list:hover{
    overflow-x:scroll;
}
/*-----------------------------------------------------------------------*/
/*让竖向列表转成横向*//*Let the list show in a line*/
#file-library-list-children {
    display: inline-flex;
    background-color: var(--side-bar-bg-color);
    /*transform: scaleY(-1);*//*让scroll显示在上面*//*Upside down the scroll to show on the up part*/
}
.pin-outline #typora-sidebar:not(.use-file-tree-style) #file-library{
    background-color: var(--bg-color);
}
/*-----------------------------------------------------------------------*/
/*设置Tag的显示样式并绘制分隔符*//*Set every tag and draw the separator*/
.show-folder-name .file-list-item{
    padding-top: 12px;
}
.file-list-item{
    padding-top: 12px;
    padding-bottom: 8px;
    padding-left: 0;
    padding-right: 8px;
    width: 144px;
    height: 54px;
}
.file-list-item.active{
    padding-left: 24px;
    padding-right: 8px;
    border-top-left-radius: 15%;
    border-top-right-radius: 15%;
    background-color: var(--bg-color);
}
.file-list-item:first-child{
    padding-left: 24px;
}
.file-list-item:not(.active) + .file-list-item:not(.active) .file-list-item-file-name-part::before{
    content: "|";
    padding-left: 0;
    padding-right: 24px;
}
.file-list-item.active + .file-list-item:not(.active){
    padding-left: 24px;
}
/*-----------------------------------------------------------------------*/
/*设置预览*//*Set the summary*/
.file-list-item-summary{ display: none; }
.show-folder-name .file-list-item-parent-loc, .show-folder-name .file-list-item-time{ display: none; }

#typora-sidebar:not(.use-file-tree-style):not(.active-tab-outline) .file-list-item:hover .file-list-item-summary,
#typora-sidebar:not(.use-file-tree-style):not(.active-tab-outline) .show-folder-name .file-list-item:hover .file-list-item-parent-loc,
#typora-sidebar:not(.use-file-tree-style):not(.active-tab-outline) .show-folder-name .file-list-item:hover .file-list-item-time{
    position: fixed;
    left: 1%;
    height: 100%;
    width: calc(var(--sidebar-width) - 1%);
    display: block;
}
#typora-sidebar:not(.use-file-tree-style):not(.active-tab-outline).ty-show-search .file-list-item:hover .file-list-item-summary,
#typora-sidebar:not(.use-file-tree-style):not(.active-tab-outline).ty-show-search .show-folder-name .file-list-item:hover .file-list-item-parent-loc,
#typora-sidebar:not(.use-file-tree-style):not(.active-tab-outline).ty-show-search .show-folder-name .file-list-item:hover .file-list-item-time{
    transform: translateY(10%);
}
#typora-sidebar:not(.use-file-tree-style):not(.active-tab-outline) .file-list-item:hover .file-list-item-summary{ top: 17%; }
#typora-sidebar:not(.use-file-tree-style):not(.active-tab-outline) .show-folder-name .file-list-item:hover .file-list-item-parent-loc{ top: 10%; }
#typora-sidebar:not(.use-file-tree-style):not(.active-tab-outline) .show-folder-name .file-list-item:hover .file-list-item-time{  top: 13%; }

/*=======================================================================*/
/*逻辑设置*//*Logical setting*/
/*-----------------------------------------------------------------------*/
/*当点击显示侧边栏时 【内容】*//*When toggling sidebar, move the content down and remain the top area for tag bar*/
.pin-outline content { min-height: 0%;top:8.5%; }
/*-----------------------------------------------------------------------*/
/*点击“树状图”时 【文件侧边栏-文件列表】*//*When click "Switch Tree View", show files list together*/
.pin-outline .use-file-tree-style #file-library-list{ display: block !important; }
/*-----------------------------------------------------------------------*/
/*当点击“大纲”时，仍然显示【文件列表】*//*When clicking "Outline", show files list together*/
.pin-outline .active-tab-outline #file-library { display: block !important; }

/*=======================================================================*/